.my_modal {
    .ant-modal-close-x{
      line-height: 60px;
      .anticon-close {
          color: transparent;
          background-image: url("../../../images/popup-close.png");
          width: 24px;
          height: 24px;
          background-position: 50%;
          background-repeat: no-repeat;
          background-size: contain;
          padding: 0;
          margin: 0;
          position: relative;
          top: -8px;
          left: 3px;
      }
    
      .anticon-close:hover {
          // opacity: 0.72;
          background-image: url("../../../images/popup-close-hover.png");
      }
    }
    .ant-modal-header{
        background-image: linear-gradient(-90deg,#05e4f8,#03c3fc 62%,#00a1ff),linear-gradient(#fff,#fff);
        .ant-modal-title{
            color: #fff;
            font-size: 18px;
        }
    }
    .body_container {
        padding-left: 20px;
    }
    .modal_footer {
        position: absolute;
        bottom: 0;
        width: 100%;
        height: 56px;
        background-color: #e8eff7;
        text-align: right;
        padding-top: 13px;
        .prev_btn {
            display: inline-block;
            margin-right: 20px;
            color: #0099ff;
            cursor: pointer;
            text-decoration: underline;
            font-size: 16px;
            &:hover {
                opacity: 0.75;
            }
        }
        .confirm_btn {
            display: inline-block;
            width: 80px;
            height: 30px;
            line-height: 30px;
            text-align: center;
            color: #fff;
            font-size: 16px;
            cursor: pointer;
            background-color: #32b432;
            margin-right: 12px;
            border-radius: 2px;
            &:hover {
                opacity: 0.75;
            }
        }
        .yellow_btn {
            display: inline-block;
            width: 80px;
            height: 30px;
            line-height: 30px;
            text-align: center;
            color: #fff;
            font-size: 16px;
            cursor: pointer;
            background-image: linear-gradient(90deg, #ffb31f 0%, #ff7e00 100%, #808358 100%, #0088af 100%), linear-gradient( #f2f2f2, #f2f2f2);
            margin-right: 12px;
            border-radius: 2px;
            &:hover {
                opacity: 0.75;
            }
        }
        .disable_btn {
            display: inline-block;
            width: 80px;
            height: 30px;
            line-height: 30px;
            text-align: center;
            color: #fff;
            font-size: 16px;
            cursor: not-allowed;
            background-image: linear-gradient(90deg, #b8b8b8 0%, #8f8f8f 100%), linear-gradient( #f2f2f2, #f2f2f2);
            margin-right: 12px;
            border-radius: 2px;
        }
        .green_btn {
            display: inline-block;
            width: 80px;
            height: 30px;
            line-height: 30px;
            text-align: center;
            color: #fff;
            font-size: 16px;
            cursor: pointer;
            background-image: linear-gradient(90deg, #00e566 0%, #12d033 62%, #23ba00 100%), linear-gradient( #f2f2f2, #f2f2f2);
            margin-right: 12px;
            border-radius: 2px;
            &:hover {
                opacity: 0.75;
            }
        }
        .blue_btn {
            display: inline-block;
            width: 80px;
            height: 30px;
            line-height: 30px;
            text-align: center;
            color: #fff;
            font-size: 16px;
            cursor: pointer;
            background-color: #00a1ff;
            margin-right: 12px;
            border-radius: 2px;
            &:hover {
                opacity: 0.75;
            }
        }
        .white_btn {
            display: inline-block;
            width: 80px;
            height: 30px;
            line-height: 28px;
            text-align: center;
            color: #33b4ff;
            font-size: 16px;
            cursor: pointer;
            background-color: #f2f2f2;
            border: 1px solid #5cc3ff;
            margin-right: 24px;
            border-radius: 2px;
            &:hover {
                opacity: 0.75;
            }
        }
        .cancel_btn {
            display: inline-block;
            width: 80px;
            height: 30px;
            line-height: 30px;
            text-align: center;
            color: #fff;
            font-size: 16px;
            cursor: pointer;
            background-color: #00a1ff;
            margin-right: 16px;
            border-radius: 2px;
            &:hover {
                opacity: 0.75;
            }
        }
    }
    .ant-modal-body {
        margin-top: -1px !important;
        .ant-spin-nested-loading {
            height: 100%;
            .ant-spin-container {
                height: 100%;
            }
        }
    }
}

@import '../../app/skin.scss';
// 皮肤名字 基础色 悬浮色 点击色 侧边栏深色背景 侧边栏浅色背景
// item选中渐变色 底部浅色背景 收缩模式下子项选择的悬浮色
@each $CLASS_NAME, 
      $BASE_COLOR in $All_SiDEBAR_COLORS {
  #{$CLASS_NAME}{
    .ant-modal-root{
      .ant-modal-header{
        background-image: none;
        background-color: $BASE_COLOR;
      }
      .modal_footer{
        background-color: rgba($color: $BASE_COLOR, $alpha: .05);
        .confirm_btn,
        .normal_blue_btn{
          background-color: $BASE_COLOR;
        }
        .cancel_btn,
        .gray_btn{
          border-color: rgba($color: $BASE_COLOR, $alpha: .3);
          color: $BASE_COLOR;
        }
      }
    }
  }
}